<template>
    <div class="container" ref="container">
      <iframe ref="iframe" :src="iframeUrl" frameborder="0" width="100%" height="100%"></iframe>
    </div>
  </template>
  
  <script setup name="WarmFlow">
  import {getToken} from "../../../utils/auth.js";
  
  const { proxy } = getCurrentInstance();
  import { onMounted, onUnmounted } from 'vue';
  
  const iframeUrl = ref(import.meta.env.VITE_APP_FLOW_API + `/flow/warm-flow-ui/index.html?id=${proxy.$route.params.id}&disabled=${proxy.$route.query.disabled}&Authorization=Bearer ` + getToken());
  
  onMounted(() => {
    window.addEventListener("message", handleMessage);
  });
  
  onUnmounted(() => {
    window.removeEventListener("message", handleMessage);
  });
  
  const handleMessage = (event) => {
    switch (event.data.method) {
      case "close":
        close();
        break;
    }
  };
  
  /** 关闭按钮 */
  function close() {
    const obj = { path: "/flow/definition" };
    proxy.$tab.closeOpenPage(obj);
  }
  </script>
  
  <style scoped>
  .container {
    width: 100%;
    height: calc(100vh - 84px);
  }
  </style>
  